import React, { Component } from 'react';
import { View, Text, ScrollView, StyleSheet, TouchableOpacity, Image } from 'react-native';
import { MapView, Marker } from 'react-native-amap3d';
import { List, TextareaItem, ImagePicker,Button } from '@ant-design/react-native';
const Item = List.Item;
const Brief = Item.Brief;
const data = [{
    url: 'https://zos.alipayobjects.com/rmsportal/PZUUCKTRIHWiZSY.jpeg',
    id: '2121',
}, {
    url: 'https://zos.alipayobjects.com/rmsportal/hqQWgTXdrlmVVYi.jpeg',
    id: '2122',
}];
export default class Home_qdbez extends Component {

    static navigationOptions = props => {

        return {
            headerTitle: `签到          `,
            headerTintColor: "#fff",
            headerTitleStyle: {
                flex: 1,
                textAlign: 'center',
                fontSize: 16
            },
            headerStyle: {
                backgroundColor: "#6E75FF",
            }
        }
    };

    state = {
        startD: 0,
        endD: 0,
        wrap: false,
        files: data,
        multiple: false,
    }

    ondw = (nativeEvent) => {
        console.log(`${nativeEvent.latitude}, ${nativeEvent.longitude}`)
    }

    onqiandao = () => {
        console.log(4567896)
    }

    onChange = (files, type, index) => {
        console.log(files, type, index);
        this.setState({
            files,
        });
    }
    onSegChange = (e) => {
        const index = e.nativeEvent.selectedSegmentIndex;
        this.setState({
            multiple: index === 1,
        });
    }

    onsubmit = () => {
        this.props.navigation.navigate('HomeScreen')
    }

    render() {
        const { files } = this.state;

        return (
            <View style={{ flex: 1, justifyContent: 'center', backgroundColor: "#ccc" }}>
                <View style={{ marginBottom: 10 }}>
                    <List>
                        <Item extra="2018/12/21" arrow="empty">
                            签到时间
                        </Item>
                        <Item extra="XXXXXXXX" arrow="empty">
                            签到地点
                        </Item>
                        <Item disabled extra="箭头向右7894561164646" arrow="horizontal" wrap={this.state.wrap} onPress={() => { this.setState({ wrap: !this.state.wrap }) }}>
                            签到备注
                        </Item>
                    </List>
                </View>

                <View style={{ flex: 1, backgroundColor: "#fff" }}>
                    <View>
                        <List>
                            <Item>
                                任务备注
                        </Item>
                        </List>
                    </View>
                    <View style={{ flex: 1 }}>
                        <TextareaItem rows={4} placeholder="最多输入100个字" count={100} />
                        <ImagePicker
                            files={files}
                            onChange={this.onChange}
                            onImageClick={(index, fs) => console.log(index, fs)}
                            selectable={files.length < 7}
                            multiple={this.state.multiple}
                        />
                        
                    </View>
                    <Button style={{backgroundColor:"#6E75FF",marginTop:20}} type="primary" onPress={this.onsubmit}>提交</Button>
                </View>
            </View>
        )
    }
}